import React, { Component } from 'react';
import { Progress } from 'react-super-progress';
import './index.styl';

export default class ProgressPage extends Component {
    render() {
        const c1 = [
            {
                r: 150,
                color: '#c1bbbb',
                value: 50,
                type: 'dashedCircle',
                divide: 48,
                width: 20,
                height: 40,
                rx: 4,
                ry: 4
            }
        ];
        const c2 = [
            {
                r: 150,
                color: '#c1bbbb',
                value: 50,
                type: 'dashedCircle',
                divide: 48,
                width: 20,
                height: 40,
                rx: 4,
                ry: 4
            }
        ];
        const c3 = [
            {
                r: 150,
                color: '#c1bbbb',
                value: 50,
                type: 'dashedCircle',
                divide: 48,
                width: 20,
                height: 40,
                rx: 4,
                ry: 4
            }
        ];
        const c4 = [
            {
                r: 150,
                color: '#c1bbbb',
                value: 50,
                type: 'dashedCircle',
                divide: 48,
                width: 20,
                height: 40,
                rx: 4,
                ry: 4
            }
        ];
        return (
            <div className="wapper">
                <div>
                    <Progress data={c1} />
                    <br />
                    <Progress data={c2} />
                    <br />
                    <Progress data={c3} />
                    <br />
                    <Progress data={c4} />
                    <br />
                </div>
            </div>
        );
    }
}
